/*This is the button design for ee-ut-battleship created by Marko Tiidla and Priit Tiidla*/

.button {
	height:35px;
	width:185px;
	margin-left:10px;
	margin-top:3px;
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #000000), color-stop(1, #092542) );
	background:-moz-linear-gradient( center top, #000000 5%, #092542 100% );
	background-color:#000000;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
	border:1px solid #070e14;
	display:inline-block;
	color:#fafafa;
	font-family:Segoe WP;
	font-size:20px;
	text-decoration:none;	
}

.button:hover {
	background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #092542), color-stop(1, #000000) );
	background:-moz-linear-gradient( center top, #092542 5%, #000000 100% );
	background-color:#092542;
	cursor:pointer;
}

button.facebookbutton {
	background-image: url('../images/facebook.png');
	height: 50px;
	width: 128px;
	margin-left:50px;
	background-size: 128px 128px;
	border-color:transparent;
	background-position:center;
	background-repeat:no-repeat;
	background-color:transparent;
	border:0px;
	}
button.facebookbutton:HOVER {
	cursor:pointer;
	}

.button:active {
	position:relative;
	top:1px;
}

.play{
	background-image: url('../images/play.png');
	background-size: 30px 30px;
	border-color:transparent;
	background-position:center;
	background-repeat:no-repeat;
	background-color:transparent;
	width: 30px;
	height: 30px;
	margin-bottom: 2px;
	border:none
}
.play:HOVER{
	cursor: pointer;
}
.play:ACTIVE{
	position: relative;
	top: 1px;
}

.pause{
	background-image: url('../images/pause.png');
	background-size: 30px 30px;	
		border-color:transparent;
	background-position:center;
	background-repeat:no-repeat;
	background-color:transparent;
	width: 30px;
	height: 30px;
	margin-bottom: 2px;
	border:none
	
}
.pause:HOVER{
	cursor: pointer;
}
.pause:ACTIVE{
	position: relative;
	top: 1px;
}

.forward{
	background-image: url('../images/forward.png');
	background-size: 30px 30px;
	border-color:transparent;
	background-position:center;
	background-repeat:no-repeat;
	background-color:transparent;
	width: 30px;
	height: 30px;
	margin-bottom: 2px;
	border:none
}
.forward:HOVER{
	cursor: pointer;
}
.forward:active{
	position: relative;
	top:1px;
}

.backward{
	background-image: url('../images/backward.png');
	background-size: 30px 30px;
	border-color:transparent;
	background-position:center;
	background-repeat:no-repeat;
	background-color:transparent;
	width: 30px;
	height: 30px;
	margin-bottom: 2px;
	border:none
}
.backward:HOVER{
	cursor:pointer;
}
.backward:active{
	position: relative;
	top: 1px;
}

#history {
	font-size:21px;
}

#newgame{
	font-size:21px;
}

#replay {
	visibility:visible;	
}

#facebook {
	background-image:url('../images/facebook.png');
	border-color:transparent;
	background-position:center;
	background-repeat:no-repeat;
	background-color:transparent;
	height:60px;
	width:200px;
}

#facebook:hover{
	cursor:pointer;
}
